$(()=> {
  // get dom elem
  let $width = $('#width'),
      $height = $('#height'),
      $btnCal = $('#calc'),
      $perimeter = $('#perimeter'),
      $widthvalidate = $('#width-validate'),
      $heightvalidate = $('#height-validate'),
      $area = $('#area');

  // 浮点摄入误差
  function roundFractional(x, n) {
    return Math.round(x * Math.pow(1000, n)) / Math.pow(1000, n);
  }

  // calc button clich
  $btnCal.click(()=> {
    // get value
    let w = Number($width.val()),
        h = Number($height.val());

    // validate
    if(validate($width, $widthvalidate) && validate($height, $heightvalidate)){

      
      // calc
      let p = (w + h) * 2,
          a = w * h;
      //output
      $perimeter.val(roundFractional(p,2));
      $area.val(roundFractional(a,2));
    }
  });
});

function validate(input, output) {
  // is empty  
  if(input.val() === '') {
    output.html('该字段不能为空');
    return false;
  } else {
    output.html('');
  }
  
  // is number
  let val = Number(input.val());
  if(isNaN(val)){
    output.html('该字段是数值');
    return false;
  } else {
    output.html('');
  }

  // is +   
  if(val < 0){
    output.html('该字段不能小于0');
    return false;
  } else {
    output.html('');
  }

  return true;
}
